<template>
  <div id="home">

    <h1>{{ msg }}</h1>
    <h2>home组件</h2>


    <!-- 引用子组件的时候绑定一个属性 ,run不能加() 加上()表示执行方法-->
    <v-head :title="title" :message="msg" :run="run" :home="this"></v-head>
  </div>
</template>



<script>

  /**
   * 父组件向子组件传值
   * 1. 父组件调用子组件的时候，动态绑定属性值
   * 
   * 2. 在子组件里面通过props接受父组件传递过来的值 
   * 
   * 
   * 
   */
  import Head from "./head.vue";
  export default {
    data() {
      return {
        msg: "home组件",
        title: "父组件的传值",
        list: []
      };
    },
    methods: {
      run(data) {
        alert("这是父组件的run方法,接受的值为:" + data);
      }
    },
    components: {
      "v-head": Head
    },
    mounted() {
      console.log("组件渲染完毕");
    }
  };
</script>

<style lang="scss">
</style>